<%@ page pageEncoding="UTF-8" %>

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
pageContext.setAttribute("basePath",basePath);
%>

<header class="am-topbar am-topbar-inverse admin-header">
    <div class="am-topbar-brand"><img alt="logo" heigth="50" src= "${basePath}image/logo.png"></div>

    <button class="am-topbar-btn am-topbar-toggle am-btn am-btn-sm am-btn-success am-show-sm-only" data-am-collapse="{target: '#topbar-collapse'}"><span class="am-sr-only">导航切换</span> <span class="am-icon-bars"></span></button>

    <div class="am-collapse am-topbar-collapse" id="topbar-collapse">
        <ul class="am-nav am-nav-pills am-topbar-nav am-topbar-right admin-header-list">
            <li>
                <a id="remind" href="#" data-am-modal="{closeViaDimmer: 0, width: 800, height: 400}">
                    <span class="am-icon-envelope-o"></span> 提醒 <span id="remindCount" class="am-badge am-badge-warning">${sessionScope.remindCount}</span>
                </a>
            </li>
            <li class="am-dropdown" data-am-dropdown>
                <a class="am-dropdown-toggle" data-am-dropdown-toggle href=""javascript:;"">
					<span class="am-icon-users"></span>
					<span id="staffId" hidden>${sessionScope.staffId}</span>
					<span id="staffName">${sessionScope.staffName}</span>
					<span id="permission" hidden>${sessionScope.permission}</span>
					<span class="am-icon-caret-down"></span>
				</a>
                <ul class="am-dropdown-content">
                    <li><a href="${ctx}/self/msg">    <span class="am-icon-user">     </span> 个人信息</a></li>
                    <li><a href="${ctx}/self/password"><span class="am-icon-cog">      </span> 修改密码</a></li>
                    <li><a href="${ctx}/portal/logout"> <span class="am-icon-power-off"></span> 退出</a></li>
                </ul>
            </li>
        </ul>
    </div>
</header>
    
<div class="am-modal am-modal-no-btn" tabindex="-1" id="doc-modal-1">
    <div class="am-modal-dialog">
        <div class="am-modal-hd">提醒
            <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
        </div>
        <div class="am-modal-bd">
            <table class="am-table am-table-striped am-table-hover table-main am-u-sm-6">
                <tbody id="tbady" style="text-align: left;">
                </tbody>
            </table>
        </div>
    </div>
</div>

<script type="text/javascript">

//10秒查询一次提醒数量
setInterval(function() {
	$.ajax({
        type: "POST",
        async:false,
        data:{
        	"staffId" : '${sessionScope.staffId}'
        },
        url: '${ctx}/login/remind',
        success: function(data) {
        	$('#remindCount').html(data);
        }
    });
}, 10000);

$('#remind').click(function () {
	var $modal = $('#doc-modal-1');
	$.ajax({
        type: "POST",
        async:false,
        data:{
        	"staffId" : '${sessionScope.staffId}'
        },
        url: '${ctx}/show/remind',
        success: function(list) {
        	var data = "";
        	
        	$.each(list, function(index, value) {
        		var temp = value.split("...");
        		data += "<tr><td><a href=${ctx}"+temp[1]+" target='_self'>"+temp[0]+"</a></td></tr>";
   			});
        	
        	$('#tbady').html(data);
        	
        	$modal.modal('toggle');
        }
    });
});

</script>